import React, {useContext} from 'react';
import matericals from '../../component/material';
import CreatorContext from './creator-context';
import './index.less';

export default (props: any) => {
  const {compConfigs, setCompConfigs} = useContext(CreatorContext);
  const {bricksConfigs} = compConfigs;
  
  console.log('bricksConfigs', bricksConfigs);
  return <div>
    {bricksConfigs.map((itemObj: object, index: number) => {
      const { displayName, demoProps } = itemObj;
      const Item = matericals[displayName];
      return (<Item {...demoProps} key={index} />);
    })}
  </div>
}